<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>餐饮总部信息</title>
    <link rel="stylesheet" href="plugins/layui/css/layui.css" media="all" />
    <link rel="stylesheet" href="css/comments.css" media="all">
	<link rel="stylesheet" href="css/font-awesome.min.css">
    <style>
        .layui-form-label{
            width: 130px;
        }
		.addFile{
		    width: 100px;
		    height: 30px;
		    border-radius: 4px;
		    border: 1px dashed #e6e6e6;
		    display: flex;
		    align-items: center;
		    justify-content: center;
		    cursor: pointer;
		    color: #666;
		    font-size: 12px;
			margin-top:20px;
			margin-left:40px;
            display: none;
		}
		.addFile:hover {
		    border: 1px dashed #f58843;
		    background: linear-gradient(316deg,#f58843 0%,#f56643 100%);;
		    color: #fff;
		}
		.addFile:hover i {
		    color: #fff;
		}
		.addFile i {
		    font-size: 14px;
		    color: #f5dab0;
		    margin-right: 5px;
		}
		.fileList{
			min-height:30px;
		}
		.fileList li{
			/* float:left; */
			margin-left:40px;
			color:#03A9F4;
		}
		.fileList li:first-child{
			/* margin-left:0px; */
		}
		.fileUpLoadName{
			cursor: pointer;
		}
        .fileUpLoadView{
            cursor: pointer;
            margin-left:10px;
            color:#9F9F9F;
        }
		.fileUpLoadView:hover{
			color:#f56643;
		}
		.sureUp{
			display:none;
			margin-left: 0px!important;
		}
		input[disabled]{
			color:#A0A0A0;
			opacity:1
		}
		.layui-disabled{
			color: #A0A0A0!important;
		}
		.maincontainer{
			display: block;
		}
        .btnList{
            display: none;
        }
    </style>
</head>
<body>
    <div class="maincontainer">
        <blockquote class="layui-elem-quote">
            餐饮总部信息
        </blockquote>
        <form class="layui-form" action="" lay-filter="example">
            <div class="layui-form-item">
                <label class="layui-form-label"><span class="redtext marginRight">*</span>账号：</label>
                <div class="layui-input-inline">
                  <input type="text" name="account" autocomplete="off" placeholder="请输入账号" class="layui-input account" maxlength="50" disabled>
                </div>
            </div>
			<div class="layui-form-item">
			    <label class="layui-form-label"><span class="redtext marginRight">*</span>密码：</label>
			    <div class="layui-input-inline">
			        <input type="password" name="password" placeholder="请输入密码" autocomplete="off" class="layui-input password" maxlength="20">
			    </div>
			    <div class="layui-form-mid layui-word-aux">注：6到20位字母或数字</div>
			</div>
			<div class="layui-form-item">
			    <label class="layui-form-label"><span class="redtext marginRight">*</span>确认密码：</label>
			    <div class="layui-input-inline">
			        <input type="password" name="password1" placeholder="请输入确认密码" autocomplete="off" class="layui-input password1" maxlength="20">
			    </div>
			</div>
			<div class="layui-form-item">
			    <label class="layui-form-label"><span class="redtext marginRight">*</span>餐饮总部名称：</label>
			    <div class="layui-input-inline">
			      <input type="text" name="foodCompanyAddress" autocomplete="off" placeholder="请输入名称" class="layui-input foodCompanyAddress" maxlength="50">
			    </div>
			</div>
			<div class="layui-form-item">
			    <label class="layui-form-label"><span class="redtext marginRight">*</span>法人代表：</label>
			    <div class="layui-input-inline">
			      <input type="text" name="legalName" autocomplete="off" placeholder="请输入法人代表" class="layui-input legalName" maxlength="20">
			    </div>
			</div>
			<div class="layui-form-item">
			    <label class="layui-form-label"><span class="redtext marginRight">*</span>联系人电话：</label>
			    <div class="layui-input-inline">
			      <input type="text" name="telephone" autocomplete="off" placeholder="请输入联系人电话" class="layui-input telephone" maxlength="11">
			    </div>
			</div>
			<div class="layui-form-item">
			    <label class="layui-form-label">统一社会信用代码：</label>
			    <div class="layui-input-inline">
			      <input type="text" name="organizationCode" autocomplete="off" placeholder="请输入统一社会信用代码" class="layui-input organizationCode" maxlength="50">
			    </div>
			</div>
			<div class="layui-form-item">
			    <label class="layui-form-label"><span class="redtext marginRight">*</span>结账模式：</label>
			    <div class="layui-input-inline">
			        <select name="billType" lay-filter="billType" class="billType" disabled>
			            <option value="2">记账</option>
						<option value="1">立结</option>
			        </select>
			    </div>
			</div>
			<div class="layui-form-item">
			    <label class="layui-form-label">结账周期：</label>
			    <div class="layui-input-inline">
					<select name="billCycle" lay-filter="billCycle" disabled="true">
					    <option value="7">7天</option>
					    <option value="15">15天</option>
					    <option value="30">一个月</option>
					    <option value="90">一个季度</option>
					    <option value="182">半年</option>
					    <option value="365">一年</option>
					</select>
			    </div>
			</div>
			<div class="layui-form-item">
			    <label class="layui-form-label">审核状态：</label>
			    <div class="layui-input-block">
			        <input type="radio" name="reviewStatus" value="0" title="待审核" checked="" disabled="true">
			        <input type="radio" name="reviewStatus" value="1" title="审核通过" disabled="true">
					<input type="radio" name="reviewStatus" value="2" title="审核不通过" disabled="true">
			    </div>
			</div>
			<div class="layui-form-item">
			    <label class="layui-form-label">资质上传：</label>
			    <div class="layui-form-mid layui-word-aux">注：只可上传PDF或图片</div>
			</div>
			<div class="layui-form-item">
			    <label class="layui-form-label"></label>
			    <div class="layui-input-block">
			        <div>
						<ul class="fileList">
							<!-- <li></li> -->
						</ul>
			        </div>
			        <div>
			            <input type="file" accept="application/pdf,image/*" id="fileUpLoad" multiple style="display: none;" name="">
			            <label class="addFile" for="fileUpLoad">
			                <i class="fa fa-cloud-upload"></i>上传
			            </label>
			        </div>
			    </div>
			</div>
			<div class="layui-form-item btnList">
				<label class="layui-form-label"></label>
				<div class="layui-input-block">
				  <button type="button" class="layui-btn demoUp" lay-filter="demoUp">修改</button>
				  <button type="button" class="layui-btn sureUp" lay-submit="" lay-filter="demo1">提交</button>
				  <button type="button" class="layui-btn layui-btn-primary" onclick="window.location.reload(true)">取消</button>
				</div>
			  </div>
        </form>
    </div>
<script type="text/javascript" src="plugins/layui/layui.js"></script>
<script type="text/javascript" src="js/jquery.min.js"></script>
<script>
	
    layui.config({
        base: 'plugins/layui/modules/',
    }).use(['http', 'form'], function() {
        var http = layui.http,
            form = layui.form;

        // 详情
		var id = '';
		var ifdelete = false;
		// var qualificationFiles = []
		selectInfo();
		function selectInfo(){
			http.get('food/manager/manager/currentFoodManagerInfo',{},function(res){
			    if(res.code == 200){
			        form.val('example', {
			            "account": res.data.account
			            ,"password": '1234'
			            ,"password1": '1234'
			            ,"foodCompanyAddress": res.data.foodCompanyAddress
			            ,"legalName": res.data.legalName
			            ,"telephone": res.data.telephone
			            ,"organizationCode": res.data.organizationCode
						,'billType':res.data.billType
						,'billCycle':res.data.billCycle
						,'reviewStatus':res.data.reviewStatus
			        });
					id = res.data.id;
					var qualificationFiles = res.data.qualificationFiles;
					qualificationFiles = JSON.parse(qualificationFiles);
					if(qualificationFiles){
						var html = "";
						for(var i=0;i<qualificationFiles.length;i++){
							html += '<li><span class="fileUpLoadName" data-url="'+qualificationFiles[i].file+'">'+qualificationFiles[i].filename+'</span><span class="fileUpLoadView">删除</span></li>';
						}
						$('.fileList').html(html)
					}
					
					// 只读
					onDisabled();
					
					if(res.data.reviewStatus==1 || res.data.reviewStatus==2){
						$('.btnList').show()
					}else{
					}
			    }else{
			        layer.msg(res.msg)
			    }
			})
		}
		
		// 资质上传
		$('#fileUpLoad').on('change', function () {
			var newFlieArr = [];
			var formData = new FormData();			        
		    var files = this.files;
			if(!files||files.length==0){
				return
			}
			var ifGo = true;
			for(var i=0;i<files.length;i++){
				var newFlie = {};
				var file = files[i];
				newFlie.filename = file.name;        //文件名
				fileext = http.getLaName(file.name);
				if(!http.isAssetType(fileext)){
					ifGo = false
					layer.msg('只可上传PDF或图片')
					break
				}
                if(!http.verificationPicFile(file,20)){ // 大小判断
                    ifGo = false
                    break
                }
				newFlieArr.push(newFlie);
				formData.append("files", files[i]);
			}
			formData.append("isfileName", false);
			formData.append("fileType", "file");
			if(ifGo){
				http.upLoad('system/file/upload/batch',formData,function(res){
					$('#fileUpLoad').val('')
				    if(res.code == 200){
						var dataList = res.data;
						for(var i=0;i<dataList.length;i++){
							newFlieArr[i].file = dataList[i];
							var html = '<li><span data-url="'+newFlieArr[i].file+'" class="fileUpLoadName">'+newFlieArr[i].filename+'</span><span class="fileUpLoadView">删除</span></li>';
							$('.fileList').append(html);
						}
				    }else{
				        layer.msg(res.msg)
				    }
				})  
			}else{
			}
		})
		
		
		// $('#fileUpLoad').on('change', function () {
		//     var files = $(this).val()
		//     var filename = files.replace(/.*(\/|\\)/, '');
		//     var fileext = (/[.]/.exec(filename)) ? /[^.]+$/.exec(filename.toLowerCase()) : '';
		// 	newFlie.filename = filename;
		//     //检查文件格式
		//     if(http.isAssetType(fileext[0])){
		//         var file = this.files
		//         var formData = new FormData();
		//         formData.append('file', file[0]);
		//         formData.append('fileType', 'file');
		//         formData.append('isFileName', false);
		//         http.upLoad('system/file/upload',formData,function(res){
		//             if(res.code == 200){
						
		// 				qualificationFiles = [];  // 限制只能上传一个
		// 				 $('.fileList').html('');
						
		// 				newFlie.file = res.data;
		// 				qualificationFiles.push(newFlie);
		// 				var html = '<li><span>'+newFlie.filename+'</span><button type="button" class="layui-btn layui-btn-primary layui-btn-xs fileUpLoadView" data-url="'+newFlie.file+'">预览</button></li>';
		//                $('.fileList').append(html);
		//             }else{
		//                 layer.msg(res.msg)
		//             }
		//         })
		
		//     }else{
		//         layer.msg('只可上传PDF或图片')
		//     }
		// })
		
		// 预览
		$(document).on('click','.fileUpLoadName',function(e){
			var url = e.target.dataset.url
		    window.open(TUrl+url)
		})
		// 删除
		$(document).on('click','.fileUpLoadView',function(e){
			if(ifdelete){
				$(this).parent().remove()
			}
		})
		
        
        
        //监听提交
        form.on('submit(demo1)', function(data){
            console.log(data.field)
            if($.trim(data.field.account) == "") {
                layer.msg('请输入账号')
                return
            }
            if($.trim(data.field.password) == "") {
                layer.msg('请输入密码')
                return
            }
            if(data.field.password != '1234'){
                if(!/^[0-9a-zA-Z]{6,20}$/.test(data.field.password)){
                    layer.msg('密码不规范')
                    return
                }
            }
            if(data.field.password != data.field.password1){
                layer.msg('密码不一致')
                return
            }
			
            if($.trim(data.field.foodCompanyAddress) == "") {
                layer.msg('请输入餐饮总部名称')
                return
            }
			if($.trim(data.field.legalName) == "") {
			    layer.msg('请输入法人代表')
			    return
			}
			if($.trim(data.field.telephone) == "") {
			    layer.msg('请输入联系电话')
			    return
			}
			if(!/^1[345789]\d{9}$/.test(data.field.telephone)){
			    layer.msg('手机号不规范')
			    return
			}
			if($.trim(data.field.organizationCode) == "") {
			    layer.msg('请输入统一社会信用代码')
			    return
			}
			
			// 资质
			var qualificationFiles = [];
			$(".fileList").find("li").each(function(){
				var list = {
					file:$(this).find("span").eq(0)[0].dataset.url,
					filename:$(this).find("span").eq(0).html()
				};
				qualificationFiles.push(list);
			});
            var params = {
				id:id,
                account: data.field.account,
                foodCompanyAddress: data.field.foodCompanyAddress,
                legalName: data.field.legalName,
                telephone: data.field.telephone,
                organizationCode: data.field.organizationCode,
				billType:data.field.billType,
				qualificationFiles:JSON.stringify(qualificationFiles)
            }
            if(data.field.password != '1234'){
                params.password = data.field.password
            }
            http.post('food/manager/manager/updateCurrentFoodManagerInfo',params,function(res){
                if(res.code == 200){
                    layer.msg('操作成功')
                    $('.demoUpN').show();
                    $('.demoUp').hide();
					$('.sureUp').hide();
					$('.btnList').hide();
					onDisabled();
					form.val('example', {
						'reviewStatus':0
					});
                }else{
                    layer.msg(res.msg)
                }
            })
        });
		
		$(".demoUp").click(function () {
			$('.sureUp').show();
			ifdelete = true;
			$('.demoUp').hide();
			// $('.account').removeAttr("disabled");
			$('.password').removeAttr("disabled");
			$('.password1').removeAttr("disabled");
			$('.foodCompanyAddress').removeAttr("disabled");
			$('.legalName').removeAttr("disabled");
			$('.telephone').removeAttr("disabled");
			$('.organizationCode').removeAttr("disabled");
			// $('.billType').removeAttr("disabled");
            $('.addFile').css('display','flex')
			form.render();
		})
		
		function onDisabled(){
			// $('.account').attr("disabled",'true');
			ifdelete = false;
			$('.password').attr("disabled",'true');
			$('.password1').attr("disabled",'true');
			$('.foodCompanyAddress').attr("disabled",'true');
			$('.legalName').attr("disabled",'true');
			$('.telephone').attr("disabled",'true');
			$('.organizationCode').attr("disabled",'true');
			$('.addFile').css('display','none')
			// $('.billType').attr("disabled",'true');
			form.render();
		}
		
		// 失焦验证密码
		$("input[name=password]").blur(function(e){
			let password1 = $('input[name=password1]').val();
			http.verifPwd($(this).val(),password1,1);
		}) 
		$("input[name=password1]").blur(function(e){
			let password = $('input[name=password]').val();
			http.verifPwd(password,$(this).val(),2);
		})
    })
</script>
</body>